<div id="content">
	<div class="row s_page_title">
		<sa-big-breadcrumbs [items]="['视频监控','视频监控']" icon="fa fa-television" class="col-xs-12 col-sm-7 col-md-7 col-lg-4"></sa-big-breadcrumbs>
	</div>
	<sa-widgets-grid>
		<div class="s_table">
			<div sa-widget [editbutton]="false" color="darken" class="clearfix">
				<header><span class="widget-icon"> <i class="fa fa-table"></i> </span><h2>视频监控</h2></header>
				<div>
					<div class="widget-body no-padding">
						<div class="table_scroll v-content">
							<div class="row v-head">
								<ul>
									<li class="lis"  *ngFor="let item of deviceList" [attr.title]="item.statusText" [ngClass]="{active:activeLis == item.deviceid}" (click)="deviceSelect(item)">
										<i class="fa  fa-video-camera" [ngClass]="{iconActive:item.status == 1}"></i>
										{{item.carlicence}}</li>
								</ul>
								<!--<div (click)="realTimeVideo()" class="v-video-io"> >> 实时视频</div>-->
							</div>
							<div class=""style="padding-left: 12px;">
								<div class="inline_block" id="v-player" style="width:calc(100% - 380px);height:720px ;position: relative;"> 
								  	<video #videoelement id="videoElement" controls="controls" autoplay="autoplay" style="width:100%;height:720px ;">您的浏览器不支持此应用.</video>
									<div class="v-player-icons" (click)="playerIcon()">
										<i class="fa  fa-angle-left v-icon" [ngClass]="{none:vIcon == '0'}" ></i>
										<i class="fa  fa-angle-right v-icon" [ngClass]="{none:vIcon == '1'}" ></i>
									</div>
								</div>
								
								<div class="v-nav" [ngClass]="{none:vIcon == '1'}">
									<div style="background-color: #333;height: 720px;">
										<p class="v-nav-head">历史视频列表</p>
										<table-select-date [notInit]='true' [minDay]="true" (outerTime)="getSelectTableTime($event)" ></table-select-date>
										<button class="btn btn-primary v-search" (click)="historyVideoSearch()">搜索</button>
										<!--<div *ngIf="videoList.length < 1" class="v-empty-data">暂无历史视频数据</div>-->
										<ul class="nav-ul" *ngIf="videoList.length > 0">
											<li class="video-lis" *ngFor="let item of videoList; let i = index" [ngClass]="{navActive:activeNav == i}" (click)="videoFileSelected(item,i)">
												<div class="module">
													<div class="v-file-img">
														<i class="fa fa-play-circle" *ngIf="activeNav != i"></i>
														<i class="fa fa-pause-circle-o" *ngIf="activeNav == i"></i>
													</div>
													<div class="v-file-info">
														<p class="title">通道{{item.chl}}_视频片段</p>
														<p class="time"><span>{{item.startTime}}</span><span> 至 </span><span>{{item.endTime}}</span></p>
													</div>
												</div>
											</li>
										</ul>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</sa-widgets-grid>
</div>